import eventEmitter from '@/utils/EventEmitter'

export const userAuth = {
  bind(el, binding) {
    const listener = buttonRole => {
      // binding的值可以传入一个字符串 也可以传入一个数组
      if (Array.isArray(binding.value)) {
        // 一个数组 就要区分是两个数组完全一致才能使用按钮 还是数组中有任意符合的角色才能使用按钮 我选择则只要符合数组中任意角色就能使用按钮
        if (binding.value.some(role => buttonRole.includes(role))) {
          el.disabled = false
        } else {
          el.remove()
        }
      } else if (Object.prototype.toString.call(binding.value) === '[object String]') {
        // 一个字符 直接丢到权限数组中对比即可
        if (buttonRole.includes(binding.value)) {
          el.disabled = false
        } else {
          el.remove()
        }
      } else {
        console.error('userAuth 指令绑定失败，binding.value 必须是字符串或数组')
      }
    }
    eventEmitter.on('userButtonRole', listener)
  }
}

/**
 * 1 如果手动控制按钮的禁用状态 应为按钮手动添加禁用样式 (使用 display 还是 disabled 取决于实际需求 display更简单一点)
 * 2 同步代码永远有限于异步代码 所以是先发布事件再订阅事件 这样可以保证代码的同步性
 * 3 some 和 every 的区别 前者只要有一个item符合就返回true 后者必须全部item符合才返回true
 */
